﻿<!doctype html>

<title>在线评级计算模型</title>
<meta charset="utf-8"/>
<link rel=stylesheet href="resource/doc/docs.css">

<link rel="stylesheet" href="resource/lib/codemirror.css">
<link rel="stylesheet" href="resource/addon/hint/show-hint.css">
<script src="resource/lib/codemirror.js"></script>
<script src="resource/addon/hint/show-hint.js"></script>
<script src="resource/addon/hint/xml-hint.js"></script>
<script src="resource/mode/xml/xml.js"></script>
<script src="http://libs.baidu.com/jquery/2.1.1/jquery.min.js"></script>

<style type="text/css">
      .CodeMirror { border: 1px solid #eee; }
    </style>
<div id=nav>
  <a href="https://git.oschina.net/xiandafu/eval"><h1>评级</h1></a>

  <ul>
    
   
  </ul>
  <ul>
    <li><a class=active href="../index.html">例子一</a>
    <li><a href="../doc/manual.html">例子二</a>
  </ul>
</div>

<article>
<h2>测试例子，直接运行或者修改模型后运行</h2>
<form name="inputForm">
<textarea id="code" name="code">
<?xml version="1.0" encoding="UTF-8"?>
<workspace name="评级">
    <project name="卫生评级">
        <doc name="评级得分" f="sum">
            <node name="变量定义列表" f="block">
                  <!-- yes or no  -->
                  <node name="等级列表">{"yes":5,"no":1}</node>
            </node>
            <node name="题目一">lookup(答案1,等级列表) </node>   
            <node name="题目二">lookup(答案2,等级列表) </node>  
        </doc>
    </project>
</workspace>
</textarea>


<div>
变量名称1:<input name="paraName0" value="答案1"> 值:<input name="paraValue1" value="yes">
</div>
<div>
变量名称2:<input name="paraName1" value="答案2"> 值:<input name="paraValue2" value="no">
</div>
<div>
变量名称3:<input name="paraName2" value=""> 值:<input name="paraValue3" value="">
</div>
<div>
变量名称4:<input name="paraName3" value=""> 值:<input name="paraValue4" value="">
</div>
<div>
变量名称5:<input name="paraName4" value=""> 值:<input name="paraValue5" value="">
</div>
<button type="button" id="run">计算结果</button> <input id="result" name="result" readonly value="">

</form>   

<script>
$(document).ready(function(){
   $("#run").bind("click",
	 function() {
	   var input = $('#inputForm').serialize();
	   $.ajax({
           type: "POST",
           dataType: "json",
           url: "${ctxPath}/run.json",
           data: input,
           success: function (result) {
        	       
               $("#result").val(result);
           },
           error: function(data) {
               alert("error:"+data.responseText);
            }
       });     
	 });

});

</script>
    <script>
      var dummy = {
        attrs: {
          color: ["red", "green", "blue", "purple", "white", "black", "yellow"],
          size: ["large", "medium", "small"],
          description: null
        },
        children: []
      };

      var tags = {
        "!top": ["top"],
        "!attrs": {
          id: null,
          class: ["A", "B", "C"]
        },
        top: {
          attrs: {
            lang: ["en", "de", "fr", "nl"],
            freeform: null
          },
          children: ["animal", "plant"]
        },
        animal: {
          attrs: {
            name: null,
            isduck: ["yes", "no"]
          },
          children: ["wings", "feet", "body", "head", "tail"]
        },
        plant: {
          attrs: {name: null},
          children: ["leaves", "stem", "flowers"]
        },
        wings: dummy, feet: dummy, body: dummy, head: dummy, tail: dummy,
        leaves: dummy, stem: dummy, flowers: dummy
      };

      function completeAfter(cm, pred) {
        var cur = cm.getCursor();
        if (!pred || pred()) setTimeout(function() {
          if (!cm.state.completionActive)
            cm.showHint({completeSingle: false});
        }, 100);
        return CodeMirror.Pass;
      }

      function completeIfAfterLt(cm) {
        return completeAfter(cm, function() {
          var cur = cm.getCursor();
          return cm.getRange(CodeMirror.Pos(cur.line, cur.ch - 1), cur) == "<";
        });
      }

      function completeIfInTag(cm) {
        return completeAfter(cm, function() {
          var tok = cm.getTokenAt(cm.getCursor());
          if (tok.type == "string" && (!/['"]/.test(tok.string.charAt(tok.string.length - 1)) || tok.string.length == 1)) return false;
          var inner = CodeMirror.innerMode(cm.getMode(), tok.state).state;
          return inner.tagName;
        });
      }

      var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
        mode: "xml",
        lineNumbers: true,
        extraKeys: {
          "'<'": completeAfter,
          "'/'": completeIfAfterLt,
          "' '": completeIfInTag,
          "'='": completeIfInTag,
          "Ctrl-Space": "autocomplete"
        },
        hintOptions: {schemaInfo: tags}
      });
    </script>
  </article>
